body{width: 100%;height: 100%;position: absolute;background:yellowgreen;}

.buffer{background-color:gray;width:100%;height:5px;position:absolute;z-index:1;}
.progress{background-color:rgb(255,153,0);width:5%;height:5px;position:absolute;z-index:11;}
audio{width:100%;height:15px;}
/*图标位置*/
.btn{
	width:70px;height:70px;
    border-radius: 50%;
    background: black;
    display: inline-block;
    opacity: 0.6; cursor: pointer;
	background-repeat:no-repeat;background-position:center ;
}
#exitBtn{width:40px;height:40px;position:absolute;right:30px;top:20px;}
.disc{width:300px;height:380px;position: absolute;z-index:5;top: 15%;left: 39%; }
.pauseBtn {position:absolute; top: 115px; left: 115px; }
.btnWrapper{ width: 700px; height: 70px;  position: absolute; z-index:5px;left: 50%; margin-left: -350px; bottom: 30%;}
.left{ position: absolute; left: 0;}
.right{ position: absolute; right: 0; margin-right: 30px;}
.fi-power,.fi-trash,.fi-heart,.fi-next,.fi-volume{font-size:36;color:rgba(255,204,0,0.5);position:relative;}
.fi-power{left:15%;top:10%;}
.fi-pause,.fi-play{font-size:42;color:rgba(255,204,0,0.5);position:relative;}
.fi-pause{left:36%;top:20%;}
.fi-play{left:36%;top:20%;display:none;}
.fi-trash{left:35%;top:25%;}
.fi-heart{left:30%;top:25%;}
.fi-next{left:30%;top:25%;}
.fi-volume{left:30%;top:25%;}
.red{color:rgb(255,86,19);}
.shine{color:rgba(255,204,0,1);}
.volume_wrap{width:100px;height:10px;position:absolute;right:18%;top:62%;display:none;}

.volume_wrap{width:20px;height:50px;position:absolute;right:25%!important;top:50%!important;}
.hidden{display:none;}
.fi-volume-strike:hover{color:rgba(255,204,0,1);}
.fi-volume-strike{font-size:36;color:rgba(255,204,0,0.5);position:relative;left:30%;top:25%;}

/*光盘旋转*/
@-webkit-keyframes disc-rotate{ 0%{transform:rotate(0deg);} 100%{transform:rotate(360deg);}}
@-o-keyframes disc-rotate{ 0%{transform:rotate(0deg);} 100%{transform:rotate(360deg);}}
@-moz-keyframes disc-rotate{ 0%{transform:rotate(0deg);} 100%{transform:rotate(360deg);}}
@-ms-keyframes disc-rotate{ 0%{transform:rotate(0deg);} 100%{transform:rotate(360deg);}}

.cover{ width:300px;height:300px;border-radius:50%;
    box-shadow: 0 0 5px 3px rgba(183, 173, 160, 0.5);
-webkit-animation:disc-rotate 12s linear 0 infinite normal backwards;-ms-animation:disc-rotate 12s linear 0 infinite normal backwards;
-o-animation:disc-rotate 12s linear 0 infinite normal backwards;-moz-animation:disc-rotate 12s linear 0 infinite normal backwards;
}

#musicInfo{width:160px;height:60px;margin:10px auto;text-align:center;color:gray;}

/*图标摇摆动画*/
.disBtn{ margin-left: 30px;-webkit-animation:btn-rotate 5s ease-in 0 infinite alternate backwards;-ms-animation:btn-rotate 5s ease-in 0 infinite alternate backwards;-o-animation:btn-rotate 5s ease-in 0 infinite alternate backwards;-moz-animation:btn-rotate 5s ease-in 0 infinite alternate backwards;}

@-webkit-keyframes btn-rotate{
	0%{transform:rotate(60deg);}
    50%{transform:rotate(0deg);}
    100%{transform:rotate(-60deg);}
}
@-ms-keyframes btn-rotate{
	0%{transform:rotate(60deg);}
    50%{transform:rotate(0deg);}
    100%{transform:rotate(-60deg);}
}
@-o-keyframes btn-rotate{
	0%{transform:rotate(60deg);}
    50%{transform:rotate(0deg);}
    100%{transform:rotate(-60deg);}
}
@-moz-keyframes btn-rotate{
	0%{transform:rotate(60deg);}
    50%{transform:rotate(0deg);}
    100%{transform:rotate(-60deg);}
}

/*用户信息侧栏*/
.leftContent{width:25%;height:99%;background-color:white;opacity:0.9;position:absolute;left:0%;display:none;
top:1%;}
#headPortrait{width:100px;height:150px;position:relative;left:35%;top:15px;overflow:hidden;text-align:center;}
#headPortrait div{width:100px;height:100px;border-radius:50%;background-color:gray;overflow:hidden;}
#headPortrait div img{width:100px;height:auto;cursor:pointer;}
#headPortrait p{cursor:pointer;color:rgb(255,153,0);font-size:21px;}
#content{width:80%;position:relative;left:20%;}
#content .link{color:balck;}
.tag{width:30px;height:90px;background-color:white;opacity:0.9;position:absolute;left:0;top:35%;text-align:center;
vertical-align:middle;cursor:pointer;}
.fi-anchor{font-size:18;color:rgb(255,153,0);}
.guild{color:gray;width:80px;height:30px;cursor:pointer;border-bottom-width: 1px;border-bottom-style: solid;border-bottom-color: rgba(226, 235, 194,0.5);}




